<template>
	<view class="goto">

		<view class="goto_box">

			<image src="/static/goto/logo.png" mode="widthFix" class="goto_box_image"></image>
			<image src="/static/goto/title1.png" mode="widthFix" class="goto_box_image1"></image>
			<image src="/static/goto/text.png" mode="widthFix" class="goto_box_image2"></image>

			<view class="goto_box_button">
				<view class="goto_box_button_item" @click="appgotoFun">
					安卓下载
				</view>
				<view class="goto_box_button_item" @click="gotumoren">
					苹果H5链接
				</view>
				<view class="goto_box_button_item" @click="appgotoFun">
					进入数农在线
				</view>
			</view>
		</view>



		<!-- 下载专区 -->
		<view class="xzzq_box" v-if="updateTypes">
			<view class="xzzq_box_">
				{{dlbtn == ''?'正在下载0%':dlbtn}}
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				dlbtn: '',
				appUptext: '',
				updateTypes: false,
				equipment: ''
			}
		},
		methods: {
			appgotoFun() {
				let _this = this;
				if (process.env.UNI_PLATFORM === 'h5') {
					// 在H5环境中打开
					console.log('在H5环境中打开');
					this.equipment = 'H5';
					window.location.href = 'http://snh5.jibeimall.com/';
				} else if (process.env.UNI_PLATFORM === 'app-plus') {
					// 在App环境中打开
					console.log('在App环境中打开');
					plus.runtime.launchApplication({
						pname: 'com.app.zyhc',
						action: 'myappzyhc://path/to/page'
					}, function(e) {
						_this.downloads();
						// console.log(e);
					});
				}
			},
			gotumoren() {
				if (process.env.UNI_PLATFORM === 'h5') {
					// 在H5环境中打开
					window.location.href = 'http://snh5.jibeimall.com/#/';
				} else if (process.env.UNI_PLATFORM === 'app-plus') {
					// 在App环境中打开
					plus.runtime.openURL('http://snh5.jibeimall.com/#/', function(err) {
						uni.showToast({
							title: JSON.stringify(err),
							duration: 8000
						})
					});
				}
			},
			//提示
			showinteraction(title, icon = 'none') {
				uni.showToast({
					title,
					icon,
					duration: 2000,
					mask: false
				})
			},
			downloads() {
				if (process.env.UNI_PLATFORM === 'h5') {
					// 在H5环境中打开
					console.log('在H5环境中打开');
					this.showinteraction('请在App端点击下载');
				} else if (process.env.UNI_PLATFORM === 'app-plus') {
					// 在App环境中打开
					console.log('在App环境中打开');
					this.updateTypes = true;
					this.pointerevents = 'none'
					this.link = 'wifi'
					this.dlbtn = '正在下载 0%'
					this.newtext = '正在后台下载，请稍后'
					let _this = this;
					var downToak = plus.downloader.createDownload(

						"http://newappadmin.zhongzihuacai.com/newzyhc.apk", { //拿到下载任务的对象
							filename: '_doc/update/'
						},
						function(d, status) {
							plus.nativeUI.closeWaiting();
							if (status == 200) { //在回调中根据状态 进行操作
								plus.runtime.install(plus.io.convertLocalFileSystemURL(d
									.filename), {}, {}, function(
									error) {
									uni.showToast({
										title: '安装失败',
										mask: false,
										duration: 1500
									});
								})
							} else {
								app.alert("配置出错,请检查网络链接！");
							}
						});
					downToak.start(); // 开启下载的任务
					var prg = 0;
					downToak.addEventListener("statechanged", function(task,
						status) { //给下载任务设置一个监听 并根据状态  做操作
						// console.log(prg)
						switch (task.state) {
							case 1:
								break;
							case 2:
								break;
							case 3:
								prg = parseInt(parseFloat(task.downloadedSize) / parseFloat(task
									.totalSize) * 100);
								_this.dlbtn = '正在下载 ' + prg + '%';
								_this.right = 100 - Number(prg) + '%'
								_this.style_css = 'width:' + prg + '%;';
								if (prg === 100) {
									_this.updateTypes = false;
									_this.dlbtn = '';
								}
								break;
							case 4:
								break;
						}
					});
				}
			},
			back() {
				uni.navigateBack({
					delta: 1
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.xzzq_box {
		width: 280rpx;
		height: 100rpx;
		position: fixed;
		top: 200rpx;
		left: 0;
		right: 0;
		margin: 0 auto;
		background-color: rgba(0, 0, 0, 0.5);
		z-index: 100000;
		line-height: 100rpx;
		text-align: center;
		color: #fff;
		border-radius: 100rpx;
		font-size: 28rpx;

	}

	.goto {
		width: 100%;
		height:calc(100vh - 88rpx);
		display: flex;
		flex-direction: column;
		background-color: #A7181F;
		overflow: auto;

		.goto_title {
			width: 100%;
			height: 88rpx;
			background-color: #A7181F;
			padding-top: var(--status-bar-height);
			box-sizing: content-box;
		}

		.goto_box {
			width: 100%;
			flex: 1;
			background-color: #A7181F;
			background-size: 100% 100%;
			background-repeat: no-repeat;
			position: relative;

			.goto_box_image {
				width: 150rpx;
				display: flex;
				justify-content: center;
				position: absolute;
				left: 0;
				right: 0;
				top: 100rpx;

				margin: auto;
			}

			.goto_box_image1 {
				width: 70vw;
				display: flex;
				justify-content: center;
				position: absolute;
				left: 0;
				right: 0;
				top: 300rpx;

				margin: auto;
			}

			.goto_box_image2 {
				width: 70vw;
				display: flex;
				justify-content: center;
				position: absolute;
				left: 0;
				right: 0;
				top: 520rpx;

				margin: auto;
			}

			.goto_box_button {
				width: 50vw;
				height: 350rpx;
				position: absolute;
				left: 0;
				right: 0;
				top: 620rpx;
				bottom: 0;
				margin: auto;
				display: flex;
				flex-direction: column;
				justify-content: space-around;

				.goto_box_button_item {
					width: 100%;
					height: 100rpx;
					background-color: #fff;
					color: #bbb;
					line-height: 100rpx;
					text-align: center;
					border-radius: 10rpx;
					font-size: 38rpx;
				}
			}


		}

	}
</style>